<template>
  <div>
    <el-dialog :title="carInfo?(carInfo.carCode):'历史'" :visible.sync="dialogVisible" width="80%">
      <div>
        <el-row>
          <el-col :sm="4">
            <div class="g-title">历史数量({{total}}个）</div>
          </el-col>
        </el-row>
        <el-table
          ref="multipleTable"
          :data="listData"
          tooltip-effect="dark"
          border
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column type="index" label="序号" width="55"></el-table-column>
          <el-table-column prop="comname" label="所属单位" align="center"></el-table-column>
          <el-table-column prop="clname" label="申请历史" align="center"></el-table-column>
          <el-table-column prop="createDate" label="申请时间" align="center"></el-table-column>
          <el-table-column label="申请结果" align="center">成功</el-table-column>
          <el-table-column label="操作" align="center" width="240">
            <template slot-scope="scope">
              <div>
                <el-button type="success" size="small" @click="viewTask(scope.row,false,2)">历史详情</el-button>
              </div>
            </template>
          </el-table-column>
        </el-table>

        <el-row style="padding: 32px 16px;">
          <el-col>
            <el-pagination
              background
              layout="total, sizes, prev, pager, next, jumper"
              :page-size="pageSize"
              :total="total"
              :current-page="pageNo"
              @current-change="fetchData"
              @size-change="pageSizeChange"
            ></el-pagination>
          </el-col>
        </el-row>
      </div>
      <div slot="footer">
        <el-button @click="dialogVisible = false">关 闭</el-button>
      </div>
    </el-dialog>
    <carcz ref="carczComp"></carcz>
    <paimai ref="paimaiComp"></paimai>
    <baofei ref="baofeiComp"></baofei>
    <tiaoji ref="tiaojiComp"></tiaoji>
    <carpb ref="carpbComp"></carpb>
    <carpbss ref="carpbssComp"></carpbss>
    <carpbss2 ref="carpbss2Comp"></carpbss2>
    <weixiu ref="weixiuComp"></weixiu>
  </div>
</template>
<script>
import { hisListJson } from "@/api/car";
import { viewJson } from "@/api/task";
import carcz from "@/views/dashboard/components/carcz/carcz"; //车辆处置组件
import paimai from "@/views/dashboard/components/carcz/paimai"; //车辆处置的拍卖组件
import baofei from "@/views/dashboard/components/carcz/baofei"; //车辆处置的报废组件
import tiaoji from "@/views/dashboard/components/carcz/tiaoji"; //车辆处置的调剂组件
import carpb from "@/views/dashboard/components/carpb/carpb"; //车辆配备组件
import carpbss from "@/views/dashboard/components/carpb/carpb_ss"; //车辆配备实施组件 新购
import carpbss2 from "@/views/dashboard/components/carpb/carpb_ss2"; //车辆配备实施组件 调剂
import weixiu from "@/views/dashboard/components/weixiu/weixiu"; //车辆保养维修审核组件
export default {
  components: {
    carcz,
    paimai,
    tiaoji,
    baofei,
    carpb,
    carpbss,
    carpbss2,
    weixiu
  },
  data: function() {
    return {
      dialogVisible: false,
      total: 0,
      pageNo: 1,
      pageSize: 10,
      listData: [], //全部数据
      listDataSelected: [], //选中数据
      editData: null, //当前修改的
      carInfo: null //车辆信息
    };
  },
  methods: {
    /**
     * @description 查看或编辑任务
     * @param data 列表原始数据
     * @param doEdit 是否编辑任务
     * @param type 当前列表类型 0待办任务 2历史任务 二者在编辑时候有区别 要传给子组件做区分
     */
    async viewTask(data, doEdit, type) {
      data.processInstanceId=data.prcid;
      //查看任务详情的参数  某些任务需要先在本页获取详细数据 根据数据显示不同的组件页面
      let params = {
        tableId: data.tableId,
        pid: data.processInstanceId,
        taskId: data.taskId,
        formKey: data.formKey
      };
      if (data.processType == "usecar") {
        if (doEdit) {
          this.$refs.usecarComp.editTask(data, type);
        } else {
          this.$refs.usecarComp.viewTask(data, type);
        }
      } else if (data.processType == "diaodu") {
        if (doEdit) {
          this.$refs.diaoduComp.editTask(data, type, data.formKey);
        } else {
          this.$refs.diaoduComp.viewTask(data, type);
        }
      } else if (data.processType == "carbz") {
        if (doEdit) {
          this.$refs.bzModifyComp.editTask(data);
        } else {
          this.$refs.bzModifyComp.viewTask(data);
        }
      } else if (data.processType == "carcz") {
        if (
          data.formKey == "carcz_shenhe" ||
          data.formKey == "carcz_sp" ||
          data.formKey == "carcz_jbrqr"
        ) {
          if (doEdit) {
            this.$refs.carczComp.editTask(data, type);
          } else {
            this.$refs.carczComp.viewTask(data, type);
          }
        } else if (data.formKey == "carcz_ss") {
          let taskDetail = await viewJson(params);
          let clname = taskDetail.data.clname; //处置方式
          if (doEdit) {
            if (clname == "拍卖") {
              this.$refs.paimaiComp.editTask(data, type, taskDetail);
            } else if (clname == "调剂") {
              this.$refs.tiaojiComp.editTask(data, type, taskDetail);
            } else if (clname == "报废") {
              this.$refs.baofeiComp.editTask(data, type, taskDetail);
            }
          } else {
            if (clname == "拍卖") {
              this.$refs.paimaiComp.viewTask(data, type, taskDetail);
            } else if (clname == "调剂") {
              this.$refs.tiaojiComp.viewTask(data, type, taskDetail);
            } else if (clname == "报废") {
              this.$refs.baofeiComp.viewTask(data, type, taskDetail);
            }
          }
        }
      } else if (data.processType == "carpb") {
        let taskDetail = await viewJson(params);
        let clname = taskDetail.data.clname; //处置方式
        //车辆配备初审通过 进入实施阶段 申请人填写相关信息
        if (data.formKey == "carpb_ss") {
          if (doEdit) {
            if (clname == "新购") {
              this.$refs.carpbssComp.editTask(data, type);
            } else if (clname == "调剂") {
              this.$refs.carpbss2Comp.editTask(data, type);
            }
          } else {
            this.$refs.carpbComp.viewTask(data, type);
          }
        } else {
          if (doEdit) {
            this.$refs.carpbComp.editTask(data, type);
          } else {
            this.$refs.carpbComp.viewTask(data, type);
          }
        }
      } else if (data.processType == "carwx") {
        if (doEdit) {
          this.$refs.weixiuComp.editTask(data, type);
        } else {
          this.$refs.weixiuComp.viewTask(data, type);
        }
      }
    },
    open(carInfo) {
      this.carInfo = carInfo;
      this.dialogVisible = true;
      this.fetchData();
    },
    pageSizeChange(newSize) {
      this.pageSize = newSize;
      this.pageNo = 1;
      this.fetchData();
    },
    handleTabClick() {
      this.pageNo = 1;
      this.fetchData();
    },
    async fetchData(pageNo) {
      if (pageNo) {
        this.pageNo = pageNo;
      }
      let params = {
        pageNo: this.pageNo,
        pageSize: this.pageSize,
        carid: this.carInfo.id
      };
      let data = await hisListJson(params);
      this.listData = data.data;
      this.total = data.total;
      this.listDataSelected.splice(0);
    },
    //表格多选
    handleSelectionChange(val) {
      this.listDataSelected.splice(0);
      val.forEach(e => {
        this.listDataSelected.push(e);
      });
    }
  }
};
</script>